<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="/css/main.css"/>
    <link rel="stylesheet" type="text/css" href="/css/more.css"/>
    <script src="/js/vue.global-3.2.45.js"></script>
    <script src="/js/axios-1.2.1.js"></script>
    <title>登录页面 | 外卖配送信息系统</title>
</head>

<body class="Top-body">
<p style="position: absolute;width: 100%;font-size: 54px; text-align: center; color: white;">外卖配送信息系统</p>>
<div class="Login" id="login-app">
    <form>
        <label class="role">
            <input type="radio" value="root" name="type" v-model="loginInfo.type"/>超管员
            <input type="radio" value="admin" name="type" v-model="loginInfo.type"/>管理员
            <input type="radio" value="sender" name="type" v-model="loginInfo.type"/>配送员
        </label>
        <br/>
        <div>
            <label>
                账号：
                <input type="text" id="user" v-model="loginInfo.phone"/>
            </label>
        </div>
        <br/>
        <div>
            <label>
                密码：
                <input type="password" id="pwd" v-model="loginInfo.password"/>
            </label>
        </div>
        <br/>
        <div>
            <label class="keptcha">
                验证码：
                <input type="text" id="kaptcha" v-model="kaptcha"/>
                <img :src="kaptchaUrl" id="kaptcha_img" alt="验证码" title="点击更换" @click="refreshKaptcha"/>
            </label>
        </div>
        <br/>
        <label>
            <input type="checkbox" value="true" name="noLogin" v-model="loginInfo.noLogin"/>3天免登录
        </label>
        <br/>

        <label>
            <input type="button" value="登陆" @click="login"/>
        </label>
        <br/>
        <span style="text-align: center; color: red">{{ loginHint }}</span>
        <div class="d-search">
            <a href="/query">点击查询外卖信息</a>
        </div>
    </form>
</div>
<br/>
<br/>
</body>
<script src="/js/login.js"></script>
</html>